<template>
  <el-dialog title="新增员工">
    <el-form label-width="120px">
      <el-form-item label="姓名：">
        <el-input class="input_width" placeholder="请输入姓名" />
      </el-form-item>
      <el-form-item label="手机：">
        <el-input class="input_width" placeholder="请输入手机号" />
      </el-form-item>
      <el-form-item label="入职时间：">
        <el-date-picker placeholder="选择日期" />
      </el-form-item>
      <el-form-item label="聘用形式：">
        <el-select placeholder="请选择">
          <el-option v-for="i in 3" :key="i" />
        </el-select>
      </el-form-item>
      <el-form-item label="工号：">
        <el-input class="input_width" placeholder="请输入工号" />
      </el-form-item>
      <el-form-item label="部门：">
        <div>
          <el-input class="input_width" placeholder="请选择部门" readonly />
          <el-tree default-expand-all />
        </div>
      </el-form-item>
      <el-form-item label="转正日期：">
        <el-date-picker placeholder="选择日期" />
      </el-form-item>
    </el-form>
    <template #footer>
      <div class="select-btn">
        <el-button type="primary">提交</el-button>
        <el-button>取消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script>
export default {
  name: 'DialogItem',
  data() {
    return {
      form: {
        username: '', // 姓名
        mobile: '', // 手机号
        timeOfEntry: '', // 入职时间
        formOfEmployment: '', // 聘用形式
        workNumber: '', // 工号
        departmentName: '', // 组织名称
        correctionTime: '' // 转正时间
      }
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-form-item__label {
  font-weight: normal;
  text-align-last: left;
  padding-left: 20px;
}
.input_width {
  width: 50%;
}
.select-btn {
  text-align: center;
}
</style>
